<script setup lang="ts">
const links = computed(() => [
  {
    label: $t('tdXNVxGid2K5s50m9bi'),
    icon: 'i-local:general?mask',
    to: { name: RN.USER_ACCOUNT },
  },
  {
    label: $t('5_0sRzr4H9Rp1FlS5KdTq'),
    icon: 'i-local:income?mask',
    to: { name: RN.USER_PROFITDAILY },
  },
  {
    label: $t('kfLf2UpxIwUmxxrEf2Xg2'),
    icon: 'i-local:g-record?mask',
    to: { name: RN.USER_GAMEHISTORY },
  },
  {
    label: $t('m9W1kxHeGgzlH3kTquL1A'),
    icon: 'i-local:transactions?mask',
    to: { name: RN.USER_TRANSATIONS },
  },
  {
    label: $t('coQTnp70TcVuFjCrzDycv'),
    icon: 'i-local:set-device?mask',
    to: { name: RN.USER_SESSIONS },
  },
]);
</script>

<template>
  <div class="grid page-content-w items-start gap-3" u:laptop="grid-cols-[auto_1fr] gap-3 py-6">
    <div class="col-span-full flex-between">
      <span class="text-xl">{{ $t('h5l_2nYi7MkLYzhInvDnv') }}</span>
    </div>

    <TRouterLinks v-if="$bp.tablet" :mode="$bp.laptop ? 'vertical' : 'horizontal'" :links="links" />

    <RouterView />
  </div>
</template>
